popiart-server
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

72 lines
2.2 KiB

import { getDictionary, type Locale } from "@/lib/site-content";
export default async function DocsPage({
params,
}: {
params: Promise<{ locale: string }>;
}) {
const { locale } = await params;
const dictionary = getDictionary(locale as Locale);
return (
<div className="page-stack">
<section className="section-panel hero-tight">
<div className="section-heading">
<div className="eyebrow">{dictionary.docs.tag}</div>
<h1>{dictionary.docs.title}</h1>
<p>{dictionary.docs.intro}</p>
</div>
</section>
<section className="docs-layout">
<article className="docs-card">
<h2>{dictionary.docs.quickStartTitle}</h2>
<ol className="number-list">
{dictionary.docs.quickSteps.map((step) => (
<li key={step.title}>
<strong>{step.title}</strong>
<p>{step.description}</p>
<pre>
<code>{step.code}</code>
</pre>
</li>
))}
</ol>
</article>
<article className="docs-card">
<h2>{dictionary.docs.envTitle}</h2>
<div className="docs-table">
{dictionary.docs.envVars.map((item) => (
<div className="docs-row" key={item.name}>
<div>
<strong>{item.name}</strong>
<span>{item.required}</span>
</div>
<p>{item.description}</p>
</div>
))}
</div>
</article>
</section>
<section className="section-panel">
<div className="section-heading">
<div className="eyebrow">{dictionary.docs.skillsTag}</div>
<h2>{dictionary.docs.skillsTitle}</h2>
</div>
<div className="card-grid">
{dictionary.docs.skills.map((skill) => (
<article className="feature-card" key={skill.name}>
<h3>{skill.name}</h3>
<pre>
<code>{skill.command}</code>
</pre>
<p>{skill.description}</p>
</article>
))}
</div>
</section>
</div>
);
}